<template>
    <view class="forget">
        <view class="form w90">
			<view class="with-fun">
				<view class="title">+86</view>
				<input class="uni-input" v-model="mobile" :placeholder="i18n.c_phone" @input="bindClearPhone"/>
				<view class="icon icon-close1" v-if="showClearPhone" @click="clearPhone"></view>
			</view>
			<view class="with-fun">
				<view class="title">{{i18n.VerificationCode}}</view>
				<input class="uni-input" v-model="captcha" :placeholder="i18n.c_iyzm" />
				<button @click="getCode" class="getyzm">{{i18n.c_yzm}}</button>
			</view>
            <view class="with-fun">
                <view class="title">{{i18n.newpwd}}</view>
                <input class="uni-input" :placeholder="i18n.newpwdt" v-model="password" :password="showPassword"/>
                <view class="icon" :class="[showPassword ? 'icon-yincang' : 'icon-chakan']"
                      @click="changePassword"></view>
            </view>
            <view class="with-fun">
                <view class="title">{{i18n.newpwd2}}</view>
                <input class="uni-input" :placeholder="i18n.newpwd2t" v-model="payword" :password="showPayword"/>
                <view class="icon" :class="[showPayword ? 'icon-yincang' : 'icon-chakan']"
                      @click="changePayword"></view>
            </view>
        </view>
        <view class="reg-but w90">
            <button type="button" @click="resetpwd"><span>{{i18n.reset}}</span></button>
        </view>
        <view class="reg-item w90">
            <view class="uni-grid-9 uni-common-mt">
                <view class="uni-grid-9-item tal" @click="goLogin" hover-class="uni-grid-9-item-hover">
                    {{i18n.SignIn}}
                </view>
                <view class="uni-grid-9-item tar" @click="goRegister" hover-class="uni-grid-9-item-hover">
                    {{i18n.register}}
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import global_ from '../../global.js';
// import encryptRSA from '../../static/utils/security.js';
import { mapState, mapMutations } from 'vuex';

export default {
    data() {
        return {
            providerList: [],
            hasProvider: false,
            account: '',
            password: '',
            positionTop: 0,
            showPassword: true,
            showPayword: true,
            showClearIcon: false,
            showClearIcode: false,
            showClearNick: false,
            showClearPhone: false,
            mobile: '',
            icode: '',
            username: '',
            payword: '',
            captcha: '',
        };
    },
    // computed: mapState(['forcedLogin']),
    computed: {
        i18n() {
            return this.$t('index');
        }
    },
    methods: {
        goLogin: function() {
            uni.navigateTo({
                url: '/pages/login/login'
            });
        },
        goRegister: function() {
            uni.navigateTo({
                url: '/pages/reg/reg'
            });
        },
        // 是否显示密码
        changePassword: function() {
            this.showPassword = !this.showPassword;
        },
        // 是否显示支付密码
        changePayword: function() {
            this.showPayword = !this.showPayword;
        },

        bindClearInput: function(e) {
            this.icode = e.target.value;
            if (e.target.value.length > 0) {
                this.showClearIcon = true;
            } else {
                this.showClearIcon = false;
            }
        },
        // 邀请码是否显示清空
        bindClearIcode: function(e) {
            this.icode = e.target.value;
            if (e.target.value.length > 0) {
                this.showClearIcode = true;
            } else {
                this.showClearIcode = false;
            }
        },
        // 清空邀请码
        clearIcode: function() {
            this.icode = '';
            this.showClearIcode = false;
        },
        // 昵称是否显示清空
        bindClearNick: function(e) {
            this.username = e.target.value;
            if (e.target.value.length > 0) {
                this.showClearNick = true;
            } else {
                this.showClearNick = false;
            }
        },
        // 清空昵称
        clearNick: function() {
            this.username = '';
            this.showClearNick = false;
        },
        // 手机是否显示清空
        bindClearPhone: function(e) {
            this.mobile = e.target.value;
            if (e.target.value.length > 0) {
                this.showClearPhone = true;
            } else {
                this.showClearPhone = false;
            }
        },
        // 清空手机
        clearPhone: function() {
            this.mobile = '';
            this.showClearPhone = false;
        },
        // 重置密码
        resetpwd() {
            let that = this;
            let pwd = this.password.toString().length;
            let paywd = this.payword.toString().length;
            if (this.mobile === '') {
                uni.showToast({ title: '请输入手机号', icon: 'none' });
            } else if (this.password === this.payword) {
                uni.showToast({ title: '支付密码和登录密码不能相同哦', icon: 'none' });
            } else if (pwd < 6) {
                uni.showToast({ title: '请输入6位以上密码', icon: 'none' });
            } else if (paywd < 6) {
                uni.showToast({ title: '请输入6位以上支付密码', icon: 'none' });
            } else if (this.captcha === '') {
                uni.showToast({ title: '请输入验证码', icon: 'none' });
            } else {
                // this.flag = true
                uni.request({
                    url: global_.url.resetpwd,
                    data: {
                        mobile: this.mobile,
                        newpassword: encryptRSA(this.password),
                        newpayword: encryptRSA(this.payword),
                        captcha: this.captcha
                    },
                    success: function(result) {
                        if (result.data.code === 0) {
                            uni.showToast({ title: result.data.msg, icon: 'none' });
                        } else {
                            uni.showToast({ title: result.data.msg, icon: 'none' });
                            this.state = 0;
                        }
                    },
                    fail: function({ errMsg }) {
                        uni.showToast({ title: '请求失败', icon: 'none' });
                    }
                });
            }
        },
        // 获取验证码
        getCode() {
            if (/^1[34578]\d{9}$/.test(this.mobile)) {
                uni.request({
                    url: global_.url.sms,
                    data: {
                        mobile: this.mobile,
                        event: 'resetpwd'
                    },
                    success: function(result) {
                        if (result.data.code === 0) {
                            uni.showToast({ title: result.data.msg, icon: 'none' });
                        } else {
                            uni.showToast({ title: result.data.msg, icon: 'none' });
                            uni.showToast({ title: '验证码已发送', icon: 'none' });
                        }
                    },
                    fail: function({ errMsg }) {
                        uni.showToast({ title: '请求失败', icon: 'none' });
                    }
                });
            } else {
                uni.showToast({ title: '请输入正确的手机号码', icon: 'none' });
            }
        },
       },
    onLoad() {
    }
};
</script>
